<include file="public@header"/>
<link rel="stylesheet" href="__STATIC__/js/element/css/element.css">
<style>
    [v-cloak] {
        display: none !important;
    }
    .bt_one{
        padding: 20px;
    }
    .bt_two{

    }

</style>
</head>
<body>

<div class="wrap js-check-wrap" id="app" v-cloak>
    <ul class="nav nav-tabs" >
        <li class="active"><a href="#">领导首页</a></li>
    </ul>
    <div style="text-align: center;margin-top: 200px;">
        <div class="bt_one">
            <el-button type="primary" @click="showAreaDialog" style="padding: 50px 86px;">对下属评分</el-button>
        </div>
        <div class="bt_two">
            <el-button type="primary" @click="showOfficeDialog" style="padding: 50px 80px;">对优秀处评分</el-button>
        </div>



        <el-dialog title="选择地区" :visible.sync="dialogTableVisible">
            <el-card shadow="hover" style="margin-top: 10px;" v-for="item in areaList">
                <div class="wrap_area">
                    <div>
                        <div class="sj_title">{{item.name}}</div>
                        <div>
                            <span>总分：{{item.all_grade}}</span>
                            <span style="margin-left: 20px;">年度总分：{{item.year_all_grade}}</span>
                        </div>
                    </div>
                    <div style="align-self: center;"><el-button type="primary" round @click="getDepartment(item.id)">进入</el-button></div>
                </div>
            </el-card>
        </el-dialog>

        <el-dialog title="选择优秀处" :visible.sync="dialogOfficeTableVisible">
            <el-select v-model="office_id" placeholder="请选择" @change="checkUserList">
                <el-option
                        v-for="item in options"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id">
                </el-option>
            </el-select>
            <el-table
                    :data="officeTableData"
                    v-loading="loading"
                    stripe
                    style="width: 100%">
                <el-table-column
                        prop="employee_id"
                        label="员工编号"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="user_login"
                        label="姓名"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="mobile"
                        label="手机号">
                </el-table-column>
                <el-table-column prop="type" label="操作">
                    <template scope="scope" >
                        <el-button type="primary" size="small" @click="checkScore(scope.row.id)">进入</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-dialog>

    </div>
</div>
<script src="__STATIC__/js/admin.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="__STATIC__/js/element/js/element.js"></script>


<script type="text/javascript">

    let app = new Vue({
        el: '#app',
        data: {
            areaList:[],
            tableData: [],
            user:'',
            avatar:'',
            dialogTableVisible: false,
            dialogOfficeTableVisible: false,
            officeTableData: [],
            options: [],
            loading: true,
            office_id: ''
        },
        created: function () {
            //获取当前评分
            let that = this;
            $.ajax({
                url: GV.ROOT + "admin/user/getCurrentGrade",
                data: {

                },
                dataType: "json",
                type: "post",
                success: function (res) {
                    if (res.code === 200) {
                        that.tableData = res.data.list
                        that.user = res.data.user
                        that.avatar = res.data.user.avatar
                    }
                }
            });

            $.ajax({
                url: GV.ROOT + "admin/user/getOfficeList",
                data: {
                    office_id:that.office_id
                },
                dataType: "json",
                type: "post",
                success: function (res) {
                    if (res.code === 200) {
                        that.options = res.data.department_list
                        that.office_id = res.data.office_id
                        that.officeTableData = res.data.user_list
                    }
                    that.loading=false
                }
            });

            $.ajax({
                url: GV.ROOT + "admin/user/sumAreaGrade",
                data: {

                },
                dataType: "json",
                type: "post",
                success: function (res) {
                    console.log(res);
                    if (res.code === 200) {
                        that.areaList = res.data
                    }
                }
            });
        },
        methods: {
            checkUserList(){
                let that = this;
                that.loading=true
                $.ajax({
                    url: GV.ROOT + "admin/user/getOfficeList",
                    data: {
                        office_id:that.office_id
                    },
                    dataType: "json",
                    type: "post",
                    success: function (res) {
                        if (res.code === 200) {
                            that.office_id = res.data.office_id
                            that.officeTableData = res.data.user_list
                        }
                        that.loading=false
                    }
                });
            },
            showAreaDialog(){
                this.dialogTableVisible = true;
            },
            showOfficeDialog(){
                this.dialogOfficeTableVisible = true;
            },
            checkScore(id){
                window.location.href= GV.ROOT + "admin/user/department_admin_audit?uid="+id
            },
            checkDetail(type){
                if (type === '1'){
                    window.location.href= GV.ROOT + "admin/user/department_audit"
                }else{
                    window.location.href= GV.ROOT + "admin/user/personal_audit"
                }
            },
            //进入各区审计局
            getDepartment(id){
                let that = this;
                $.ajax({
                    url: GV.ROOT + "admin/user/checkReport",
                    data: {
                        departmentId:id
                    },
                    dataType: "json",
                    type: "post",
                    success: function (res) {
                        console.log(res);
                        if (res.code === 200) {
                            window.location.href= GV.ROOT + "admin/user/personal_admin_audit?id="+id
                        }else{
                            that.$message({
                                message: res.message,
                                type: 'warning'
                            });
                        }
                    }
                });

            }
        }
    })
</script>


</body>
</html>